{extend name="public:base"}
{block name='css'}
{/block}

{block name='body'}
<div class="view view-main white-navbar white-page white-toolbar">
    <div data-name="home" class="page">

        <div class="navbar">
            <div class="navbar-inner">
                <div class="left"><a href="{$my_prev_url|default='/'}" class="external"><i class="iconfont icon-fanhui"></i></a></div>
                <div class="center"><span>用户管理</span></div>
                <div class="right"></div>
            </div>
        </div>

        <div class="page-content infinite-scroll-content">

            <div class="serach">
                <form name="form" action="" id="form" method="post" onsubmit="searchUser();return false;" >
                    <div class="m">
                        <div class="ico"></div>
                        <div class="key"><input type="text" name="keywords" value="{:input('keywords')}" placeholder="用户姓名/手机号" /></div>
                    </div>
                    <div class="sub"><input type="submit" value="搜索" /></div>
                </form>
            </div>

            <div class="bakcground-10"></div>

            <div class="list tx-list d-user-list" style="margin-top:0px;">
                <ul>

                </ul>
            </div>

            {include file='public:loading' /}

        </div>

    </div>
</div>
{/block}

{block name="js"}
<script>
    function getList() {
        var total = $('.tx-list li').length;
        if (total % 10 != 0) {
            return false;
        }

        if ($('.loading').is(':visible') || $('.no-more').is(':visible') || $('.no-data').is(':visible')) {
            return false;
        }
        $('.loading').show();

        var p = total / 10;
        $.post("{:url('getUserList')}", {page:p+1, keywords:$('input[name=keywords]').val(), user_type:"{:input('user_type', 0, 'intval')}"}, function(data){
            var str = '';
            $('.loading').hide();
            if (data.data.data.length > 0) {
                $.each(data.data.data, function(i,n){
                    str += '<li class="swipeout">\n' +
                        '    <div class="item-content swipeout-content">\n' +
                        '        <div class="item-inner">\n' +
                        '            <div class="item-title"><span>'+n.name+'</span></div>\n' +
                        '            <div class="item-after" style="max-height:36px;">\n' +
                        '                <div class="item-title y">\n' +
                        '                    <span>'+n.tel+'</span>\n' +
                        '                    <div class="item-footer" style="text-align: right;">推荐码：'+n.code+'</div>\n' +
                        '                </div>\n' +
                        '                <i class="iconfont icon-jiantou"></i>\n' +
                        '            </div>\n' +
                        '        </div>\n' +
                        '    </div>\n' +
                        '    <div class="swipeout-actions-right">\n' +
                        '        <a href="{:url("user_order")}?user_id='+n.id+'&name='+n.name+'" class="external open-more-actions" style="background:#66ba61;">查看订单</a>\n' +
                        '        <a href="{:url("user_goods")}?user_id='+n.id+'&name='+n.name+'" class="external swipeout-delete" style="background:#ffab3d;">添加订单</a>\n' +
                        '    </div>\n' +
                        '</li>';
                });
                if (data.data.data.length < 10) {
                    $('.no-more').show();
                }
                $(str).appendTo($('.tx-list ul'));
            } else {
                if (total > 0) {
                    $('.no-more').show();
                } else {
                    $('.no-data').show();
                }
            }
        }, 'json');
    }
    $(function(){
        getList();
    });
    function searchUser() {
        $('.tx-list ul').html('');
        $('.no-more').hide();
        $('.no-data').hide();
        getList();
    }
    //触发无限滚动
    $$('.infinite-scroll-content').on('infinite', function () {
        getList();
    });
</script>
{/block}